/**
 * =========================================================================
 * 扩展插件作用：实现Markdown文件直接用作Vue组件
 * =========================================================================
 * vite help https://github.com/lymanlai/vite-plugin-md
 */
import Markdown from 'vite-plugin-md'
import { version as vueVersion } from 'vue/package.json'

export default (options?: viteUserOptions): viteUserPlugins => {
  return {
    plugins: Markdown({
      vueVersion: '3.0.0',
      markdownItSetup(md) {
        /* 使用prism插件突出显示代码块, 高亮粒度比highlightjs很细，但需要标识代码类型 */
        md.use(require('markdown-it-prism'), { defaultLanguageForUnknown: 'js', defaultLanguageForUnspecified: 'js' })

        /* 使用highlightjs插件突出显示代码块, 带有自动识别代码类型 */
        // md.use(require('markdown-it-highlightjs'))

        // 更多markdown-it插件 see https://www.npmjs.com/search?q=keywords:markdown-it-plugin
        //.....
      },
      transforms: {
        // vue2处理一下组件导入
        after: (code: string, id: string) => {
          if (parseInt(vueVersion) < 3) {
            code = `<script setup>import MarkdownCodeBox from '@/components/markdown-code-box/index.vue';export default {components:{MarkdownCodeBox}}</script>${code}`
          }
          return code
        }
      },
      frontmatter: false, // 不使用标题配置
      headEnabled: true, // 结合useHead插件自动配置页面标题信息
      wrapperClasses: 'markdown-body', // md模板外层包裹样式
      wrapperComponent: 'markdown-code-box' //重新封装组件实现代码行号与代码复制
    })
  }
}
